<template>
    <div class="row page-titles">
        <div class="col-md-5 align-self-center">
            <h3 class="text-themecolor">
               <!-- <Breadcrumb class="m-t-xs">
                    <template  v-if="list.length">
                        <BreadcrumbItem class="cur-pointer" v-for="(item,key) in list" :key="key" ><span @click="linkChange(key)">{{item.title}}</span></BreadcrumbItem>
                    </template>
                    <BreadcrumbItem>{{pTitle}}</BreadcrumbItem>
                </Breadcrumb>-->
                {{pTitle}}</h3>
        </div>
        <div class="col-md-7 align-self-center text-right">
            <slot></slot>
        </div>
        <slot name="next"></slot>
    </div>
</template>
<script>
    import { mapGetters, mapActions } from 'vuex'
    export default {
        name: "CHeader",
        props:{
            pTitle:{
                type:String,
                default:''
            }
        },
        computed:{
            ...mapGetters(['routerHeap']),
            list(){
                return this.routerHeap.slice(0,this.routerHeap.length-1)
            }
        },
        methods:{
            ...mapActions(['popRouter']),
            linkChange(index){
                let n = this.routerHeap.length-index-1;
                this.$router.go(-n);

            }
        }
    }
</script>